<template>
    <fieldset>
        <legend>购物车</legend>
        <h1>购物车:cart</h1>
        <ul>
            <li v-for="item in cartData" :key="item.id">
                <b>
                    产品：{{item.title}}
                </b>
                ----
                <b>
                    价格:{{item.price}}
                </b>
                ----
                <b>
                    数量:{{item.count}}
                </b>
                ----
                <button>-</button>
            </li>
        </ul>
        <h1>总价:
            {{total}}
        </h1>
    </fieldset>
</template>

<script>
import { mapState,mapGetters, mapMutations, mapActions} from 'vuex';
    export default{
        computed:{
            ...mapState('cart',['cartData']),
            ...mapGetters('cart',['total']),
            ...mapActions('cart',['REMOVE_CART'])
        },
        // methods:{
        //     ...mapMutations('cart',['REMOVE_CART']),
        //     remove(item){
        //         this.REMOVE_CART(item)
        //     }
        // }
    }
</script>